<template>
    <div id="proj-editor">
        <a-skeleton :loading :paragraph="{ rows: 8 }" :active="true">
            <a-result v-if="!canEdit" title="你没有权限编辑此项目"></a-result>
            <component v-else :is="comp" :title />
        </a-skeleton>
    </div>
</template>

<script setup>
import app from '@/app'
import axios from '@/axios'
import InnoV from './innov/editor.vue'
import EntrT from './entrT/editor.vue'
import EntrP from './entrP/editor.vue'
import PrinF from './prinF/editor.vue'
import ElitE from './elitE/view.vue'
import ExpeO from './expeO/view.vue'
import { ref, onMounted, provide, watch } from 'vue'
import { cache, useEmptyData } from '../ProjectCache'

const id = app.queryString("id");
const loading = ref(true);
const canEdit = ref(true);
const dict = {
    "创新训练": InnoV,
    "创业训练": EntrT,
    "创业实践": EntrP,
    "校长基金": PrinF,
}
let comp = InnoV;
const data = useEmptyData();
const title = ref("编辑大创项目");

async function load () {
    let proj = await cache.getProj(id);
    canEdit.value = proj.canEdit;
    if (canEdit.value) {
        Object.assign(data, proj);
        comp = dict[data.basicInfo.ProjectType];
    }
    if (proj.basicInfo.isNew) {
        title.value = "新建大创项目"
    }
    app.setTitle(title.value);
    loading.value = false;
}

provide("data", data);
onMounted(load);
</script>

<style lang="less">
#proj-editor {
    .ant-skeleton {
        padding: 20px;
    }
}
</style>